<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <link rel="stylesheet" href="../../resource/dhtmlx/calender/codebase/calendar.css">
    <script src="../../resource/dhtmlx/calender/codebase/calendar.js"></script>
</head>
<body>
<section class="dhx_sample-controls">
    <button class="dhx_sample-btn dhx_sample-btn--flat" onclick="getDate()">Get Date</button>
    <input class="dhx_sample-input" id="result_input" type="text" readonly>
</section>
<section class="dhx_sample-container">
    <div class="dhx_sample-container__widget" id="calendar"></div>
</section>
<script>
    var calendar = new dhx.Calendar("calendar", {
        // 可以通过value属性设置默认值
        value: new Date(2019, 0, 12)
        , css: "dhx_widget--bordered"
        // 这样就是默认设置方式
        , dateFormat: "%Y/%m/%d"
    });
    var resultArea = document.querySelector("#result_input");

    // 获取日期选择框的值
    function getDate() {
        resultArea.value = calendar.getValue();
    }
</script>
</body>
</html>